import React, { PureComponent } from "react";
import { Flex ,Toast} from "antd-mobile";
import s from "./index.scss";

export default class extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {

    };
    
  }
  
  componentDidMount() {
    
    
  }

  render() {
   
   if(JSON.stringify(this.props.info)=='{}') return null
    return (
      <div className={`${s.pageBox}`}>
            <Flex className={`${s.itemBox}`}>
            <Flex.Item className={`${s.item} ${this.props.info.currentPage>1?'color26':''}`}
              onClick={this.props.pageBtn.bind(this,'first')}>
                首页
            </Flex.Item>
            <Flex.Item className={`${s.item} ${this.props.info.currentPage>1?'color26':''}`}
              onClick={this.props.pageBtn.bind(this,'prev')}>
                上页
            </Flex.Item>
            <Flex.Item className={`${s.item}`}>
               {this.props.flag==true?<input type="text" onFocus={this.props.handlePageFocus} value={`${this.props.info.currentPage}/${this.props.info.pageCount}`}/>:<input type="text" onBlur={this.props.handlePage} />} 
            </Flex.Item>
            <Flex.Item className={`${s.item} ${this.props.info.currentPage<this.props.info.pageCount?'color26':''}`}
                onClick={this.props.pageBtn.bind(this,'next')}>
                下页
            </Flex.Item>
            <Flex.Item className={`${s.item} ${this.props.info.currentPage<this.props.info.pageCount?'color26':''}`}
                onClick={this.props.pageBtn.bind(this,'last')}>
                尾页
            </Flex.Item>
            </Flex>
      </div>
    );
  }
}
